import React from 'react';
// @ts-ignore
import ReactLive2d from 'react-live2d'; //若提示无声明文件，无视之

export default class Live2D extends React.Component {
  private audioDOM: HTMLAudioElement | null | undefined;

  componentDidMount() {
    document.getElementById('live2d-container')?.addEventListener('click', () => {
      this.audioDOM?.play();
    });
  }

  render() {
    return (
      <>
        <style>
          {`#live2d-container {
            z-index: 999;
          }`}
        </style>
        <ReactLive2d
          width={200}
          height={300}
          ModelList={['Hiyori']}
          TouchBody={['哥哥，你好棒棒', '明天继续加油哦']}
          PathFull="http://localhost:8000/Resources/"
          menuList={[['Mtab']]}
        />
        <audio
          src="http://localhost:8000/Resources/ganbadie.mp3"
          ref={(el) => {
            this.audioDOM = el;
          }}
        ></audio>
      </>
    );
  }
}
